<div class="modal fade bs-modal-lg" id="modelContent">
	<div class="modal-dialog modal-lg">
		<div class="modal-content"></div>
	</div>
</div>
<div class="portlet box green">
	<div class="portlet-title">
		<div class="caption">
			<i class="fa fa-cog"></i>查询内容
		</div>
		<div class="tools">
			<a href="javascript:;" class="collapse right" data-original-title=""
				title=""> </a>
			<!-- <a href="" class="fullscreen" data-original-title="" title=""> </a> -->
		</div>
		<div class="actions">
			<a href="javascript:;" class="btn white btn-sm ajax-search"><i class="fa fa-search"></i> 查询 </a> 
			<a href="javascript:;" class="btn white btn-sm search-reset"><i class="fa fa-eraser"></i> 清除 </a>
			<a href="/departmentsCompany/list?companyId=$!department.companyId" class=" btn-left btn white btn-sm ajaxify"><i class="fa fa-mail-reply"></i> 返回</a>
		</div>
	</div>
	<div class="portlet-body form">
		<form action="/departmentsCompany/staffList" class="form-horizontal"
			method="get" id="searchForm">
			<div class="form-body">
				<div class="row">
					<div class="form-group">
						<div class="col-md-3">
							<label class="col-md-4 control-label">账号ID：</label>
							<div class="col-md-8">
								<input type="number" class="form-control" name="username" value="$!username"> 
								<input type="hidden" name="departmentId" value="$!department.id">
							</div>
						</div>
						<div class="col-md-3">
							<label class="col-md-4 control-label">真实姓名：</label>
							<div class="col-md-8">
								<input type="text" class="form-control" name="realname"
									value="$!realname">
							</div>
						</div>
						<div class="col-md-3">
							<label class="control-label col-md-4">#if($!staffState)
								加入时间：#else 离职时间：#end</label> <label class="col-md-8"> <input
								class="form-control" type="text" name="startTime" id="startTime"
								value="$!startTime" readonly> <i class="fa fa-calendar"
								style="position: absolute; right: 10px; top: 10px"></i>
							</label>
						</div>
						<div class="col-md-3">
							<label class="control-label col-md-2">至：</label> <label
								class="col-md-8"> <input class="form-control"
								type="text" name="endTime" id="endTime" value="$!endTime"
								readonly> <i class="fa fa-calendar"
								style="position: absolute; right: 10px; top: 10px"></i>
							</label>
						</div>
					</div>
				</div>
			</div>
		</form>
	</div>
</div>
<div class="portlet box green">
	<div class="portlet-title">
		<div class="caption">
			<i class="fa fa-cogs"></i>数据列表
		</div>
		<div class="tools">
			<a href="javascript:;" class="collapse" data-original-title=""title=""> </a>
		</div>
		<div class="actions  pull-right">
				<a href="/departmentsCompany/staffAdd?departmentId=$!department.id" class="btn white btn-sm ajaxify"><i class="fa fa-plus"></i> 新增 </a>
		</div>
	</div>
	<div class="portlet-body">
		<div class="tab-pane active form">
			<div class="dataTables_wrapper no-footer">
				<div class="table-scrollable">
					<table class="table table-striped table-bordered table-hover"
						id="tableCategory">
						<thead>
							<tr>
								<th>账号名</th>
								<th>真实姓名</th>
								<th>手机</th>
								<th>所属部门</th>
								<th>部门负责人</th>
								<th>启用</th>
								<th>加入时间</th>
								<th>操作</th>

							</tr>
						</thead>
						<tbody>
					     #foreach($userInfo in  $!pageUserInfo.Result)
 						<tr>
 							<td>$!userInfo.id</td>
 							<td>$!userInfo.realname</td>
 							<td>$!userInfo.phone</td>
 							<td>
 								#foreach($department in $!childDepartment)
 									#if($$userInfo.departmentId == $department.id)
 										 <span>$!department.title</span> 
 									#end
 								#end
 							</td>
 							<td class="department$!userInfo.departmentId">
 							#foreach($department in $!childDepartment)
 								#if($!department.responsibleId == $!userInfo.id)
 									<span >√</span>	
 								#end
 							#end
 							</td>
 							<td class="companyState">#if($!userInfo.companyState)√ #else × #end </td>
 							<td>$!userInfo.entryTime</td>
 							<td class="responsible">
 								#if($!department.id == $userInfo.departmentId)
 									 <a department-id="department$!userInfo.departmentId" thref="departmentsCompany/editResponsible?departmentId=$!department.id&userId=$!userInfo.id"  #if($!department.responsibleId == $!userInfo.id ) style="display: none;" #end  class="btn green btn-outline btn-sm ajax-editState  department" href="javascript:;">
                            	 	 <i class="fa fa-edit"></i>设置为部门负责人</a>
                            	#end
                            		 <a   thref="departmentsCompany/editState?id=$!userInfo.id"   class="btn green btn-outline btn-sm ajax-editState editState" href="javascript:;"><i class="fa fa-edit"></i>#if($!userInfo.companyState)禁用 #else启用#end</a>
 							</td>
 						</tr>
 						#end
						</tbody>
					</table>
				</div>
				#set($page= $!pageUserInfo)
				#set($pageUrl="/department/staffList?$!queryString&pageNo=")
				#parse("_page.htm")
			</div>
		</div>
	</div>
</div>
<script src="/assets/scripts/views-date.js" type="text/javascript"></script>
 <script type="text/javascript">
	$(".department").on("click", function() {
		$(".responsible").children().show();
		$(this).hide();

		var departemntId = $(this).attr("department-id");
		$("." + departemntId).html("");
		$(this).parents("tr").children().eq(4).html("<span>√</span>");
	});
	$(".editState").on("click",function(){
		var target = $(this);
		var companyShow = target.parents("tr").children(".companyState");
		companyShow.text("");
		var aState=target.text();
		if(aState == "启用"){
			target.html("<i class='fa fa-edit'></i>禁用");
			target.attr("data-state","false")
			companyShow.text("√");
		}else{
			target.html("<i class='fa fa-edit'></i>启用");
			target.attr("data-state","true")
			companyShow.text("×");
		}
	})
</script>